<template>
  <div>
    <Button type="primary" @click="modal1=true;pageList()">一人一档</Button>

    <Modal v-model="modal1" title="人员档案管理" width="1300px">
      <Form ref="formInline" inline>
        <FormItem>
          <Button type="success" @click="addClick">添加档案</Button>
        </FormItem>
      </Form>
      <Table border :columns="columns" :data="data">
        <template #action="{ row }">
          <Button type="primary" size="small" style="margin-right: 5px" @click="editClick(row)">编辑</Button>
          <Button type="info" size="small" style="margin-right: 5px" @click="viewClick(row)">查看</Button>
          <Button type="error" size="small" @click="del(row)">删除</Button>
        </template>
      </Table>
      <div slot="footer">
        <Button type="primary" size="large" @click="modal1 = false">关闭</Button>
      </div>
    </Modal>

    <Modal v-model="modal" title="添加&修改人员档案" width="1300px">
      <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80">
        <FormItem label="车辆信息" prop="car_info">
          <Input v-model="formValidate.car_info" :disabled="disabledFlag" placeholder="请输入车辆信息"></Input>
        </FormItem>
        <FormItem label="开门记录" prop="opendoor_his">
          <Input v-model="formValidate.opendoor_his" :disabled="disabledFlag" placeholder="请输入开门记录"></Input>
        </FormItem>
        <FormItem label="单位" prop="company">
          <Input v-model="formValidate.company" :disabled="disabledFlag" placeholder="请输入单位"></Input>
        </FormItem>
        <FormItem label="mac记录" prop="mac">
          <Input v-model="formValidate.mac" :disabled="disabledFlag" placeholder="请输入mac记录"></Input>
        </FormItem>
        <FormItem label="烟感" prop="smoke">
          <Input v-model="formValidate.smoke" :disabled="disabledFlag" placeholder="请输入烟感"></Input>
        </FormItem>
        <FormItem label="事件" prop="events">
          <Input v-model="formValidate.events" :disabled="disabledFlag" placeholder="请输入事件"></Input>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="primary" v-if="!disabledFlag" size="large" @click="handleSubmit">保存</Button>
        <Button type="primary" v-if="disabledFlag" size="large" @click="modal = false">关闭</Button>
      </div>
    </Modal>

  </div>
</template>

<script>
import {
  personalFileList,
  addPersonalFile,
  updatePersonalFile,
  personalFileInfo
} from '../../../../api/person-record'

export default {
  name: 'person-record',
  props: {
    userInfo: {
      type: Object
    }
  },
  data () {
    return {
      severUserInfo: {},
      data: [],
      columns: [
        {
          title: '车辆信息',
          key: 'car_info'
        },
        {
          title: '开门记录',
          key: 'opendoor_his'
        },
        {
          title: '单位',
          key: 'company'
        },
        {
          title: 'mac记录',
          key: 'mac'
        },
        {
          title: '烟感',
          key: 'smoke'
        },
        {
          title: '事件',
          key: 'events'
        },
        {
          title: '发布时间',
          key: 'create_time'
        },
        {
          title: '操作',
          slot: 'action',
          width: 200,
          align: 'center'
        }
      ],
      formValidate: {},
      ruleValidate: {
        car_info: [
          { required: true, message: '请输入车辆信息', trigger: 'blur' }
        ],
        opendoor_his: [
          { required: true, message: '请输入开门记录', trigger: 'blur' }
        ],
        company: [
          { required: true, message: '请输入单位', trigger: 'blur' }
        ],
        mac: [
          { required: true, message: '请输入mac记录', trigger: 'blur' }
        ],
        smoke: [
          { required: true, message: '请输入烟感', trigger: 'blur' }
        ],
        events: [
          { required: true, message: '请输入事件', trigger: 'blur' }
        ]
      },
      disabledFlag: false,
      modal: false,
      modal1: false,
      actionType: '' // 0:添加，1：修改
    }
  },
  methods: {
    addClick () {
      this.$refs['formValidate'].resetFields()
      this.formValidate = {}
      this.modal = true
      this.actionType = '0'
      this.disabledFlag = false
    },
    editClick (row) {
      this.$refs['formValidate'].resetFields()
      this.formValidate = {}
      this.actionType = '1'
      this.infoAction(row.id)
      this.disabledFlag = false
    },
    viewClick (row) {
      this.$refs['formValidate'].resetFields()
      this.formValidate = {}
      this.actionType = '1'
      this.infoAction(row.id)
      this.disabledFlag = true
    },
    handleSubmit () {
      this.$refs['formValidate'].validate((valid) => {
        if (valid) {
          if (this.actionType === '0') {
            this.addAction()
          } else if (this.actionType === '1') {
            this.updateAction()
          }
        } else {
          this.$Message.error('请完善信息！')
        }
      })
    },
    pageList () {
      let data = {
        cardno: this.userInfo.cardno
      }
      personalFileList(data).then((ret) => {
        if (ret.data.errcode === 0) {
          this.data = ret.data.data
        } else {
          this.$Notice.error({ title: '获取失败！', desc: ret.data.errmsg })
        }
      })
    },
    addAction () {
      this.formValidate.cardno = this.userInfo.cardno
      addPersonalFile(this.formValidate).then((ret) => {
        if (ret.data.errcode === 0) {
          this.$Message.success('添加成功')
          this.modal = false
          this.pageNo = 1
          this.pageList()
        } else {
          this.$Notice.error({ title: '添加失败！', desc: ret.data.errmsg })
        }
      })
    },
    updateAction () {
      updatePersonalFile(this.formValidate).then((ret) => {
        if (ret.data.errcode === 0) {
          this.$Message.success('修改成功')
          this.modal = false
          this.pageList()
        } else {
          this.$Notice.error({ title: '修改失败！', desc: ret.data.errmsg })
        }
      })
    },
    infoAction (id) {
      let data = {
        id: id
      }
      personalFileInfo(data).then((ret) => {
        if (ret.data.errcode === 0) {
          this.formValidate = ret.data.data
          this.modal = true
        } else {
          this.$Notice.error({ title: '失败！', desc: ret.data.errmsg })
        }
      })
    },
    del (row) {
      if (confirm('确认删除？')) {
        let data = {
          id: row.id,
          del_flag: '1'
        }
        updatePersonalFile(data).then((ret) => {
          if (ret.data.errcode === 0) {
            this.$Message.success('删除成功')
            this.pageList()
          } else {
            this.$Notice.error({ title: '删除失败！', desc: ret.data.errmsg })
          }
        })
      }
    }
  },
  mounted () {
    this.severUserInfo = this.$store.state.user.severUserInfo
  }
}
</script>

<style lang="less">
.appealmodal {
  .ivu-form .ivu-form-item-label {
    width: 120px !important;
  }

  .ivu-form-item-content {
    margin-left: 120px !important;
  }
}
</style>
